<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <!-- 引入组件库 -->
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>

    <!-- 先引入 Vue -->
    <script src="https://unpkg.com/vue/dist/vue.js"></script>
    <!-- 引入组件库 -->
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>

</head>
<style>
    .el-aside {
        background-color: #D3DCE6;
        color: #333;
        text-align: center;
        line-height: 200px;
    }

    .el-main {
        background-color: #E9EEF3;
        color: #333;
        text-align: center;
        line-height: 160px;
    }

    .tac {

        width: 250px;
        height: 1000px;
    }

</style>
<body>
<div id="app">
    <el-container>
        <el-aside width="250px" height="1000px">
            <el-row class="tac" width="250px">
                <el-col :span="24">
                    <el-menu
                            default-active="2"
                            class="el-menu-vertical-demo"
                            @open="handleOpen"
                            @close="handleClose"
                            background-color="#545c64"
                            text-color="#fff"
                            active-text-color="#ffd04b">
                        <el-submenu index="1">
                            <template slot="title">
                                <i class="el-icon-location"></i>
                                <span>导航一</span>
                            </template>
                            <el-menu-item-group>
                                <template slot="title">分组一</template>
                                <el-menu-item @click="qiehuan" index="1-1">用户列表</el-menu-item>
                                <el-menu-item index="1-2">选项2</el-menu-item>
                            </el-menu-item-group>



                        </el-submenu>

                    </el-menu>
                </el-col>
            </el-row>
        </el-aside>
    </el-container>
</div>
</body>
</html>
<script>
    new Vue({
        el: '#app',
        data: function () {
            return {visible: false}
        },

    })
</script>
<!--<script>-->

<!--    $("#btn1").click(function(){-->
<!--        $("#content").load("/templates/main.html");-->
<!--    });-->
<!--</script>-->